<ion-header>

  <ion-toolbar>
    <ion-title>Inset Inputs</ion-title>
  </ion-toolbar>

</ion-header>


<ion-content class="outer-content">

  <ion-list inset>

    <ion-item>
      <ion-icon name="search" item-start></ion-icon>
      <ion-input value="Input inside an inset list"></ion-input>
    </ion-item>

    <ion-item>
      <ion-icon name="call" item-start></ion-icon>
      <ion-input type="tel"></ion-input>
    </ion-item>

    <ion-item>
      <ion-icon name="mail" item-start></ion-icon>
      <ion-input placeholder="Placeholder text"></ion-input>
    </ion-item>

  </ion-list>


  <ion-list inset>

    <ion-item inset>
      <ion-icon name="search" item-start></ion-icon>
      <ion-input value="Inset input inside an inset list"></ion-input>
    </ion-item>

    <ion-item inset>
      <ion-input value="Inset input inside an inset list"></ion-input>
      <ion-icon name="mic" item-end></ion-icon>
    </ion-item>

  </ion-list>


  <ion-list>

    <ion-item inset>
      <ion-icon name="search" item-start></ion-icon>
      <ion-input value="Inset input inside a list"></ion-input>
      <button ion-button outline item-end>Search</button>
    </ion-item>

  </ion-list>


  <ion-card>

    <ion-item>
      <ion-icon name="search" item-start></ion-icon>
      <ion-input value="Input inside a card"></ion-input>
    </ion-item>

    <ion-item>
      <ion-input value="Input inside a card"></ion-input>
      <ion-icon name="mic" item-end></ion-icon>
    </ion-item>

  </ion-card>

</ion-content>